<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>支付</title>
    <link rel="stylesheet" href="../css/pay.min.css">
    <link rel="stylesheet" href="../css/style.css">
    <link rel="shortcut icon" href="../img/f11.ico" type="image/x-icon">
    <script src="../utill/flexible.js"></script>
    <script src="../utill/jquery-3.5.1.min.js"></script>
</head>

<body>
    <div class="top">
        <a id="back"></a>
        <p>确认订单</p>
    </div>
    <div class="main">
        <div class="infor1">
            <img src="" alt="">
            <div>
                <p>订单号： 72132342241</p>
                <h4 class="movie-title"></h4>
                <span>万达影城（双流万达广场杜比影院店） <br> 英文 2D</span>
            </div>
        </div>
        <div class="infor2">
            <ul>
                <li>
                    <span>观影日期</span>
                    <span>时间</span>
                </li>
                <li>
                    <span id="nowTime">2020-04-16 星期一</span>
                    <span id="clickTime"></span>
                </li>
                <li>
                    <span>座位</span>
                    <span>座位总数</span>
                </li>
                <li>
                    <span id="seatInfor">

                    </span>
                    <span id="seatNum">3</span>
                </li>
                <li>
                    <span>总价</span>
                    <span>服务费</span>
                </li>
                <li>
                    <span class="priceAll"></span>
                    <span>￥3.00</span>
                </li>
                <li>
                    <span>优惠</span>
                    <span></span>
                </li>
                <li>
                    <span>-￥0.00</span>
                    <span></span>
                </li>
            </ul>
        </div>
        <div class="infor3">
            <div>
                <span>总计</span>
                <p class="priceAll"></p>
            </div>
            <button id="buy">去支付</button>
        </div>
    </div>

    <!-- 点击支付弹出页面 -->
    <!--支付方式弹窗-->
    <div class="pay-type" style="opacity: 1; display: none;">
        <div class="mask"></div>
        <div class="dialog">
            <div class="title">
                <div>
                    <img src="../img/pay/arrow.png" alt="" class="close">
                    支付
                </div>
                <button class="close">退出支付</button>
            </div>
            <div class="bank">
                <img src="../img/pay/bank.png" alt="">
            </div>
            <div class="infor-pay">
                <div>
                    <span>总计</span>
                    <p class="priceAll"></p>
                </div>
                <button id="confirmBuy">去支付</button>
            </div>
        </div>
    </div>
    <!--支付密码弹窗-->
    <div class="pay-password">
        <div class="mask"></div>
        <div class="dialog">
            <div class="title"><i class="close iconfont icon-Close"></i>输入支付密码</div>
            <div class="content">
                <p class="name movie-title"></p>
                <p class="price priceAll"></p>
                <div class="pay-type" style="opacity: 1;">
                    <span class="type">支付方式</span>
                    <span>银行卡</span>
                </div>
                <div class="password">
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </div>
            </div>
        </div>
        <!--支付键盘-->
        <div class="pay-keyboard">
            <dl>
                <dd data-num="1">1</dd>
                <dd data-num="2">2</dd>
                <dd data-num="3">3</dd>
            </dl>
            <dl>
                <dd data-num="4">4</dd>
                <dd data-num="5">5</dd>
                <dd data-num="6">6</dd>
            </dl>
            <dl>
                <dd data-num="7">7</dd>
                <dd data-num="8">8</dd>
                <dd data-num="9">9</dd>
            </dl>
            <dl>
                <dd data-num="" class="bg-gary"></dd>
                <dd data-num="0">0</dd>
                <dd data-num="" class="bg-gary" id="delPass"><i class="iconfont icon-del"></i></dd>
            </dl>
        </div>
    </div>




    <!-- 弹出框js -->
    <script>
        $("#buy").click(function () {
            $(".pay-type").css("display", "block");
        });
        $(".close").click(function () {
            $(".pay-type,.pay-password").css("display", "none");
        });
        $("#confirmBuy").click(function () {
            $(".pay-password").css("display", "block");
        });


        var i = 0;
        $(".pay-keyboard dd").click(function () {
            //alert(isNumber(1));

            var isnum = /^\d+$/.test($(this).html());
            if (isnum == true && i < 6) {
                //alert($(this).html());
                $(".password li").eq(i).html($(this).html());
                i = i + 1;
            }

            //alert(i);
            if ($(this).html().length > 5 && i > 0) {
                $(".password li").eq(i - 1).html("");

                i = i - 1;
            }

            if (i == 6) {
                $(".pay-password,.pay-type").css("display", "none");
                var data = getData("payDetail");
                var seat = getData("seat-mobile");
                //添加时间数据
                var date = new Date().toLocaleString();
                console.log(date);
                data.date = date;
                //添加属性
                data.totalPrice = data.clickPrice * seat.length;
                data.amount = seat.length;

                //添加本地user数据
                var local = getData('userPage-mobile');
                console.log(local);

                local.push(data);
                saveData(local);
                location.href = 'myMv.html';
                alert('支付成功');

            }
        });

        function isNumber(val) {

            var regPos = /^\d+(\.\d+)?$/; //非负浮点数
            var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数
            if (regPos.test(val) && regNeg.test(val)) {
                return true;
            } else {
                return false;
            }

        }
    </script>

    <script src="../js/pay.js"></script>
</body>

</html>